<style>
.side-spread .side-fixed .side-btn {
    position: relative;
    z-index: 2;
    border-radius: 24px;
    color: #fff;
    background: #190c04;
    display: inline-block;
    padding: 6px 30px;
    font-size: .9rem
}

.side-spread .side-fixed:hover {
    background: #ff3c34;
    box-shadow: 0 0 20px rgba(255,164,0,0.75)
}

.side-spread .side-fixed:hover .side-cat {
    animation: catRotate .75s infinite
}

.side-spread .side-fixed .close-wrap {
    position: relative
}

.side-spread .side-fixed .close-btn {
    position: absolute;
    width: 14px;
    height: 14px;
    top: 16px;
    left: 52px;
    right: 52px;
    padding: 5px;
    line-height: 12px !important;
    border: 1px solid #eee;
    border-radius: 50%;
    color: #eee;
    transition: all .3s
}

.side-spread .side-fixed .close-btn:hover {
    transform: rotate(180deg) scale(1.1);
    color: #ff352f;
    background: #fff;
    box-shadow: 0 0 15px rgba(0,0,0,0.5)
}

.side-spread .side-fixed .close-btn>i.icon {
    font-size: 12px;
    vertical-align: middle
}

.side-spread .side-score {
    height: 70px;
    background: url(//mapp.alicdn.com/1565694341501PJD9oKragaSFsgR.png) no-repeat center 0
}

.side-spread .side-cat {
    height: 110px;
    margin-bottom: -15px;
    background: url(//mapp.alicdn.com/1565694341501PJD9oKragaSFsgR.png) no-repeat center -70px
}

.side-spread .side-mark {
    position: fixed;
    width: 100%;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0,0,0,0.7);
    z-index: 100;
    display: none
}

.side-spread .side-modal {
    position: fixed;
    height: 655px;
    margin-top: -350px;
    left: 0;
    right: 0;
    top: 50%;
    bottom: 0;
    z-index: 101;
    background: url(//mapp.alicdn.com/1565694358448JPQ9Mx2S9XHYSiK.png) no-repeat center center;
    transform: scale(.01);
    opacity: 0;
    transition: all .45s ease-in-out
}

.side-spread .side-modal.closed {
    display: none
}

.side-spread .side-modal.opened {
    transform: scale(1);
    opacity: 1
}

.side-spread .hide-btn {
    position: absolute;
    right: -140px;
    top: 0;
    width: 36px;
    height: 36px;
    border: 1px solid #fff;
    border-radius: 20px;
    color: #fff;
    line-height: 36px;
    text-align: center;
    transition: all .3s
}

.side-spread .hide-btn:hover {
    transform: rotate(180deg) scale(1.1);
    color: #ff352f;
    background: #fff;
    box-shadow: 0 0 15px rgba(0,0,0,0.5)
}

.side-spread .side-inner {
    height: 100%;
    width: 610px;
    margin: auto;
    position: relative
}

.side-spread .side-header {
    height: 265px
}

.side-spread .side-body {
    padding: 50px 50px
}

.side-spread .side-qrcode {
    width: 175px;
    height: 175px;
    text-align: center;
    margin-top: -15px
}

.side-spread .side-qrcode p {
    margin-bottom: 4px;
    font-size: 1.05rem
}

.side-spread .side-qrcode .side-img {
    padding-bottom: 5px
}

.side-spread .side-qrcode img {
    width: 150px
}

.side-spread .side-list {
    width: 240px;
    height: 175px
}

.side-spread .side-list li {
    margin-bottom: 18px
}

.side-spread .side-list li i.icon {
    color: #2cc197;
    margin-right: 18px;
    vertical-align: middle
}

.side-spread .side-footer {
    text-align: center
}

.side-spread .side-footer a.btn {
    padding: 10px 50px;
    border-radius: 25px;
    background: #ff352f;
    font-size: 1.1rem;
    color: #fff;
    font-weight: 400;
    box-shadow: none
}

.side-spread .side-footer a.btn:hover {
    background: #ff2f4c;
    margin-top: -10px
}
</style>

<!-- 领取积分窗口开始 -->
<div class="side-spread">
	<div class="side-mark"></div>
	<a href="javascript:void(0);" class="side-fixed">
		<div class="side-score"></div>
		<div class="side-cat"></div>
		<div title="点击免费注册" class="side-btn">注册即送</div>
		<div class="close-wrap">
			<span class="close-btn"><i class="icon icon-close"></i></span>
		</div>
	</a>
	<div class="side-modal closed">
		<div class="side-inner">
			<div class="side-header"></div>
			<div class="side-body">
				<div class="clearfix">
					<div class="side-qrcode pull-left">
						<p>扫一扫，联系客服</p>
						<div class="side-img">
							<img class="daoshi-qrcode" src="//mapp.alicdn.com/1567560760155zhpqINUOo6if2Gu.png" alt="">
						</div>
						<h4>客服微信：<b class="text-orange daoshi-id">微信号</b></h4>
					</div>
					<div class="side-list pull-right">
						<ul>
							<li><i class="icon icon-check"></i><span>为你解答各种电商难题</span></li>
							<li><i class="icon icon-check"></i><span>教你快速提升店铺流量</span></li>
							<li><i class="icon icon-check"></i><span>增加店铺宝贝收藏、加购</span></li>
							<li><i class="icon icon-check"></i><span>提高权重、优化商品排名</span></li>
							<li><i class="icon icon-check"></i><span>查验黑号，防止受骗</span></li>
						</ul>
					</div>
				</div>
			</div>
			<div class="side-footer">
				<a href="/regist.html" class="btn">去注册，领积分</a>
			</div>
			<a href="javascript:;" class="hide-btn">
				<i class="icon icon-close"></i>
			</a>
		</div>
	</div>
</div>
<!-- 领取积分窗口结束 -->
